<template>
  <div class="wh" style="">
    <!-- <ToolItem title="环境设置" type="environment" @select="$emit('active', $event)">
      <icon-cloud :style="{ fontSize: '25px' }" />
    </ToolItem> -->
    <!-- <div class="right-tools" v-if="active == 'environment'"> -->
    <div class="wh" v-if="true" style="display: flex; flex-wrap: wrap;align-content: flex-start;">
      <!-- 点位 -->
      <!-- <el-tooltip content="点位" placement="right" mini> -->
        <div :style="{  }" class="tianqiitemclass" @click="measureMentType = 'POINT'" title="点位">
          <!-- <icon-cloud :style="{ fontSize: '28px' }" /> -->
          <img :src="'/assets/fenxi/dianwei.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      <!-- </el-tooltip> -->
      <!-- 距离 -->
      <!-- <el-tooltip content="距离" placement="right" mini> -->
        <div :style="{  }" class="tianqiitemclass" @click="measureMentType = 'SPACE_DISTANCE'" title="距离">
          <!-- <icon-cloud :style="{ fontSize: '28px' }" /> -->
          <img :src="'/assets/fenxi/juli.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      <!-- </el-tooltip> -->
      <!-- 高度 -->
      <!-- <el-tooltip content="高度" placement="right" mini> -->
        <div :style="{  }" class="tianqiitemclass" @click="measureMentType = 'TRIANGLE_DISTANCE'" title="高度">
          <!-- <icon-cloud :style="{ fontSize: '28px' }" /> -->
          <img :src="'/assets/fenxi/gaodu.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      <!-- </el-tooltip> -->
      <!-- 面积 -->
      <!-- <el-tooltip content="面积" placement="right" mini> -->
        <div :style="{  }" class="tianqiitemclass" @click="measureMentType = 'SPACE_AREA'" title="面积">
          <!-- <icon-cloud :style="{ fontSize: '28px' }" /> -->
          <img :src="'/assets/fenxi/mianji.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      <!-- </el-tooltip> -->
      <!-- 体积 -->
      <!-- <el-tooltip content="体积" placement="right" mini>
        <div :style="{ backgroundColor: '#068CC0' }" class="tianqiitemclass" @click="daqi = !daqi" title="体积">
          <img :src="'/assets/fenxi/tiji.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      </el-tooltip> -->
      <!-- 清空 -->
      <!-- <el-tooltip content="清空" placement="right" mini> -->
        <div :style="{ backgroundColor: '' }" class="tianqiitemclass" @click="qingkongclick()" title="清空">
          <!-- <icon-tool :style="{ fontSize: '28px' }" /> -->
          <img :src="'/assets/fenxi/qingkong.png'" alt="" style="width: 20px;filter: invert(100%) brightness(550%);">
        </div>
      <!-- </el-tooltip> -->
    </div>
  </div>
</template>

<script>
// import ToolItem from '@/components/map/tools/ToolItem.vue'

let pickEntity = null
export default {
  name: '',
  components: {
    // ToolItem,
  },
  data() {
    return {
      measureMentType: '',
    }
  },
  computed: {
    active(){
      // return this.activeToolParent.value || this.activeTool.value || null
      return true
    }
  },
  // inject: ['activeTool','activeToolParent'],
  watch: {
  },
  mounted() {
    this._disposers = [];
    this._disposers.push(XE.MVVM.bind(this, 'measureMentType', earth.analyzation.measurement, 'type'));
  },
  beforeDestroy() {
    this._disposers.forEach(d => d());
    this._disposers.length = 0;
  },
  methods: {
    qingkongclick() {
      // 阴晴雨雪 网格 离散网格
      earth.analyzation.measurement.clearResults()
    },
    closewindow(){
      this.qingkongclick()
    }
  },
}
</script>

<style lang="scss" scoped>

.wh{
  width: 100%;
  height: 100%;
}
.tianqiitemclass {
  border: 1px solid #fff9;
  border-radius: 5px;
  margin: 5px;
  cursor: pointer;
  // border-radius: 6px 6px 6px 6px;
  width: 50px;
  height: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  color: white;
  align-items: center;

  &:hover {
    background-color: #068cc088;
  }
}

.zhjx-iconfont {
  font-size: 25px !important;
}

</style>
